<template>
  <Category :disabledSelector="isShowAttrList"  @category3ID="categoryIDChange"></Category>
  <el-card style="margin-top:10px">
      <SpuList v-if="scene===1"></SpuList>
      <SpuForm v-if="scene===2"></SpuForm>
      <SkuForm v-if="scene===3"></SkuForm>
    </el-card>
</template>

<script lang="ts">
import Category from "@/components/Category/index.vue"
import SpuList from './components/SpuList.vue'
import SpuForm from './components/SpuForm.vue'
import SkuForm from './components/SkuForm.vue'
export default {
  name: "Spu",
  components:{
    Category,
    SpuList,
    SpuForm,
    SkuForm
  }
};
</script>
<script lang="ts" setup>
import {ref,watch} from 'vue'
const scene = ref(1)
let category1Id = ref<any>("");
let category2Id = ref<any>("");
let category3Id = ref<any>("");
const isShowAttrList=ref<boolean>(true)
  const categoryIDChange = (n: any) => {
  // category3ID.value = n.value
  category1Id.value = n.category1Id;
  category2Id.value = n.category2Id;
  category3Id.value = n.category3Id;
  }
  //根据三级导航ID来获取属性列表 需要监听三级导航id得变化
watch(
  () => category3Id.value.value,
  (newVal: any) => {
    if (!newVal) {
     
      return;
    }
    //触发三级id值后发送请求
   // 获取属性列表
  },
  { immediate: true }
);
</script>
<style></style>
